<!DOCTYPE html>
<html xmlns:http="http://www.w3.org/1999/xhtml" xmlns: xmlns: lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
    />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>福山-人员轨迹</title>
    <link rel="stylesheet" type="text/css" href="../assets/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../assets/css/elemet-ui.css"/>
    <link rel="stylesheet" type="text/css" href="../assets/css/rem.css"/>
    <link rel="stylesheet" href="../assets/css/repeat.css">
    <link rel="stylesheet" href="../assets/icons/iconfont.css">
    <link href="../assets/map/offlinemap/css/map.css" type="text/css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../assets/css/style.css"/>
</head>

<body class="bighome2">
<div id="app" v-cloak>
    <div class="pageTitle">
        <!--<ul class="tabUl">-->
        <!--<li :class="{'li_active':activeIndex === index}" v-for="(item, index) in menuList" :key="index"-->
        <!--@click="routerGo(item)">{{item.name}}-->
        <!--</li>-->
        <!--</ul>-->
        <div class="pageTitle-logo">
            <img src="../assets/images/logo.png"/>
            <a href="javascript:void(0)">福山公安数据治理系统</a>
        </div>
        <ul class="pageTitle-list">
            <li><a href="javascript:void(0)">全息档案<i class="el-icon-caret-bottom"></i></a></li>
            <li><a href="javascript:void(0)">警情研判<i class="el-icon-caret-bottom"></i></a></li>
            <li><a href="javascript:void(0)">风险防控<i class="el-icon-caret-bottom"></i></a></li>
            <li><a href="javascript:void(0)">分析工具<i class="el-icon-caret-bottom"></i></a></li>
            <li>
                <a href="javascript:void(0)">轨迹分析<i class="el-icon-caret-bottom"></i></a>
                <ul class="pageTitle-list-data">
                    <li><a href="trajectoryAnalysisCrash.html">碰撞分析</a></li>
                    <li><a href="trajectoryAnalysisPersonnel.html">人员轨迹</a></li>
                    <li><a href="trajectoryAnalysisAccompany.html">伴随分析</a></li>
                    <li><a href="trajectoryAnalysisTime.html">时间碰撞分析</a></li>
                    <li><a href="trajectoryAnalysisPath.html">路线匹配分析</a></li>
                </ul>
            </li>
        </ul>
    </div>
    <div class="pageNavigation">
        <div class="pageNavigation-dot">
        </div>
        <div class="pageNavigation-text">智能作战系统 > 轨迹分析 ></div>
        <div class="pageNavigation-txt">人员轨迹</div>
        <!--<el-button type="primary" size="mini" @click="window.location.href='bigHome.html'" style="position:absolute;right:5rem;">-->
        <!--重点人员管控-->
        <!--</el-button>-->
    </div>

    <div class="personnel-view">
        <div class="personnel-view-k">
            <div id="map_demo"></div>
            <!--<div class="task-list">-->
            <!--<div>-->
            <!--<h4>任务列表</h4>-->
            <!--<button>新建任务</button>-->
            <!--</div>-->
            <!--<ul>-->
            <!--<li>-->
            <!--<div>-->
            <!--<h5>任务名称：911连环杀人案</h5>-->
            <!--<p>提交时间：2018-04-03  15：02：03</p>-->
            <!--</div>-->
            <!--<div>-->
            <!--<button>开始碰撞</button>-->
            <!--</div>-->
            <!--</li>-->
            <!--<li>-->
            <!--<div>-->
            <!--<h5>任务名称：911连环杀人案</h5>-->
            <!--<p>提交时间：2018-04-03  15：02：03</p>-->
            <!--</div>-->
            <!--<div>-->
            <!--<button class="active">碰撞中</button>-->
            <!--</div>-->
            <!--</li>-->
            <!--<li>-->
            <!--<div>-->
            <!--<h5>任务名称：911连环杀人案</h5>-->
            <!--<p>提交时间：2018-04-03  15：02：03</p>-->
            <!--</div>-->
            <!--<div>-->
            <!--<button class="active1">碰撞完成</button>-->
            <!--</div>-->
            <!--</li>-->
            <!--<li>-->
            <!--<div>-->
            <!--<h5>任务名称：911连环杀人案</h5>-->
            <!--<p>提交时间：2018-04-03  15：02：03</p>-->
            <!--</div>-->
            <!--<div>-->
            <!--<button class="active1">碰撞完成</button>-->
            <!--</div>-->
            <!--</li>-->
            <!--<li>-->
            <!--<div>-->
            <!--<h5>任务名称：911连环杀人案</h5>-->
            <!--<p>提交时间：2018-04-03  15：02：03</p>-->
            <!--</div>-->
            <!--<div>-->
            <!--<button class="active1">碰撞完成</button>-->
            <!--</div>-->
            <!--</li>-->
            <!--</ul>-->
            <!--<div class="flag">-->
            <!--<i class="icon iconfont icon-dingwei1"></i>-->
            <!--<i class="icon iconfont icon-dingwei2"></i>-->
            <!--<i class="icon iconfont icon-dingwei3"></i>-->
            <!--</div>-->
            <!--</div>-->
            <div class="task-list crash-new-task add-condition-code">
                <div>
                    <h4>添加轨迹特征码</h4>
                </div>
                <div class="add-code">
                    <template>
                        <el-select v-model="value" placeholder="请选择特征码">
                            <el-option
                              v-for="item in options"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value">
                            </el-option>
                        </el-select>
                    </template>
                    <input type="text" placeholder="请输入关键字">
                    <button>添加</button>
                </div>
                <div class="add-code-title">
                    添加轨迹特征码
                </div>
                <div class="add-code-content">
                    <ul class="add-contrail-code">
                        <li>
                            <span class="add-condition-tool">电话</span>
                            <span class="add-condition-num">1351111111</span>
                            <span class="add-condition-icon">
                                <i class="icon iconfont icon-weibiaoti--3"></i>
                                <i class="icon iconfont icon-lianjie00"></i>
                            </span>
                        </li>
                        <li>
                            <span class="add-condition-tool">电话</span>
                            <span class="add-condition-num">1351111111</span>
                            <span class="add-condition-icon">
                                <i class="icon iconfont icon-weibiaoti--3"></i>
                                <i class="icon iconfont icon-lianjie00"></i>
                            </span>
                        </li>
                        <li>
                            <span class="add-condition-tool">电话</span>
                            <span class="add-condition-num">1351111111</span>
                            <span class="add-condition-icon">
                                <i class="icon iconfont icon-weibiaoti--3"></i>
                                <i class="icon iconfont icon-lianjie00"></i>
                            </span>
                        </li>
                        <li>
                            <span class="add-condition-tool">电话</span>
                            <span class="add-condition-num">1351111111</span>
                            <span class="add-condition-icon">
                                <i class="icon iconfont icon-weibiaoti--3"></i>
                                <i class="icon iconfont icon-lianjie00"></i>
                            </span>
                        </li>
                        <li>
                            <span class="add-condition-tool">电话</span>
                            <span class="add-condition-num">1351111111</span>
                            <span class="add-condition-icon">
                                <i class="icon iconfont icon-weibiaoti--3"></i>
                                <i class="icon iconfont icon-lianjie00"></i>
                            </span>
                        </li>
                        <li>
                            <span class="add-condition-tool">电话</span>
                            <span class="add-condition-num">1351111111</span>
                            <span class="add-condition-icon">
                                <i class="icon iconfont icon-weibiaoti--3"></i>
                                <i class="icon iconfont icon-lianjie00"></i>
                            </span>
                        </li>
                    </ul>
                    <div class="add-condition-date">
                        <div class="add-condition-date-txt">
                            <span>关联特征码</span>
                            <i class="icon iconfont icon-weibiaoti--27"></i>
                        </div>
                        <div class="add-condition-detail">
                            <div class="add-condition-detail-num">
                                <span>MAC</span>
                                <div>
                                    <template>
                                        <el-checkbox-group v-model="checkList_mac">
                                            <el-checkbox label="A">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="B">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                        </el-checkbox-group>
                                    </template>
                                </div>
                            </div>
                            <div class="add-condition-detail-num">
                                <span>IMSI</span>
                                <div>
                                    <template>
                                        <el-checkbox-group v-model="checkList_imsi">
                                            <el-checkbox label="A">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="B">12-4F-89-RF-4G-V5</el-checkbox>
                                            <el-checkbox label="C">12-4F-89-RF-4G-V5</el-checkbox>
                                        </el-checkbox-group>
                                    </template>
                                </div>
                            </div>
                            <div class="add-condition-detail-num">
                                <span>身份证</span>
                                <div>
                                    <template>
                                        <el-checkbox-group v-model="checkList_card">
                                            <el-checkbox label="A">12-4F-89-RF-4G-V5</el-checkbox>
                                        </el-checkbox-group>
                                    </template>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="add-code-title">
                    选择轨迹时间
                </div>
                <div class="select-datetime">
                    <template>
                        <div class="block timeStyle-text">
                            <span class="demonstration">从</span>
                            <el-date-picker
                              v-model="value4"
                              type="datetimerange"
                              range-separator="至"
                              start-placeholder="开始日期"
                              end-placeholder="结束日期">
                            </el-date-picker>
                        </div>
                    </template>
                </div>
                <div class="analyze-track">
                    <button >分析轨迹</button>
                </div>
                <div class="flag">
                    <i class="icon iconfont icon-dingwei1"></i>
                    <i class="icon iconfont icon-dingwei2 icon-active"></i>
                    <i class="icon iconfont icon-dingwei3"></i>
                </div>
            </div>


            <!--<div class="result-list task-list track-details">-->
            <!--<div>-->
            <!--<h4>碰撞特征分析</h4>-->
            <!--<button><i class="icon iconfont icon-weibiaoti&#45;&#45;27"></i></button>-->
            <!--</div>-->
            <!--<ul class="condition-code track-details-title crash-title">-->
            <!--<li>-->
            <!--<div>碰撞特征分析-->
            <!--<i class="icon iconfont icon-xialasanjiao"></i>-->
            <!--</div>-->
            <!--</li>-->
            <!--</ul>-->
            <!--<ul class="condition-code track-details-title crash-title1">-->
            <!--<li>-->
            <!--<div>碰撞码特征列表</div>-->
            <!--</li>-->
            <!--</ul>-->
            <!--<template>-->
            <!--<el-select v-model="value" placeholder="请选择类型" class="select-type">-->
            <!--<el-option-->
            <!--v-for="item in options"-->
            <!--:key="item.value"-->
            <!--:label="item.label"-->
            <!--:value="item.value">-->
            <!--</el-option>-->
            <!--</el-select>-->
            <!--</template>-->
            <!--<table class="type-table">-->
            <!--<thead>-->
            <!--<tr class="type-table-title">-->
            <!--<th><i class="icon iconfont icon-biaoqian"></i></th>-->
            <!--<th>特征码</th>-->
            <!--<th>操作</th>-->
            <!--</tr>-->
            <!--</thead>-->
            <!--<tbody>-->
            <!--<tr>-->
            <!--<td>IMSI</td>-->
            <!--<td>18616415416</td>-->
            <!--<td><button>一键查询</button></td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>IMSI</td>-->
            <!--<td>18616415416</td>-->
            <!--<td><button>一键查询</button></td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>IMSI</td>-->
            <!--<td>18616415416</td>-->
            <!--<td><button>一键查询</button></td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>IMSI</td>-->
            <!--<td>18616415416</td>-->
            <!--<td><button>一键查询</button></td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>IMSI</td>-->
            <!--<td>18616415416</td>-->
            <!--<td><button>一键查询</button></td>-->
            <!--</tr>-->
            <!--<tr>-->
            <!--<td>IMSI</td>-->
            <!--<td>18616415416</td>-->
            <!--<td><button>一键查询</button></td>-->
            <!--</tr>-->
            <!--</tbody>-->
            <!--</table>-->
            <!--</div>-->
            <!--<div class="result-list task-list track-details">-->
            <!--<div>-->
            <!--<h4>任务详情</h4>-->
            <!--<button><i class="icon iconfont icon-weibiaoti&#45;&#45;27"></i></button>-->
            <!--</div>-->
            <!--<ul class="condition-code track-details-title">-->
            <!--<li>-->
            <!--<div>任务名称：911连环杀人案路线跟踪</div>-->
            <!--</li>-->
            <!--</ul>-->
            <!--<template>-->
            <!--<div class="block track-date crash-title">-->
            <!--<span>轨迹时间：</span>-->
            <!--</div>-->
            <!--</template>-->
            <!--<div class="condition-list">-->
            <!--<el-card class="box-card track-card crash-card">-->
            <!--<div slot="header" class="clearfix">-->
            <!--<span>条件一：</span>-->
            <!--</div>-->
            <!--<div class="card-con">-->
            <!--<div  class="text item">-->
            <!--<div class="node-title">碰撞时间：</div>-->
            <!--<div class="node-content">-->
            <!--<i class="icon iconfont icon-weibiaoti&#45;&#45;23 date-icon"></i>-->
            <!--<input type="text" class="date-input">-->
            <!--至-->
            <!--<i class="icon iconfont icon-weibiaoti&#45;&#45;23 date-icon"></i>-->
            <!--<input type="text" class="date-input">-->
            <!--</div>-->
            <!--<div class="node-title">碰撞设备：</div>-->
            <!--<div class="node-content">-->
            <!--<template>-->
            <!--<el-radio  label="1">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--</template>-->
            <!--</div>-->
            <!--</div>-->
            <!--</div>-->
            <!--</el-card>-->
            <!--<el-card class="box-card track-card crash-card">-->
            <!--<div slot="header" class="clearfix">-->
            <!--<span>条件一：</span>-->
            <!--</div>-->
            <!--<div class="card-con">-->
            <!--<div  class="text item">-->
            <!--<div class="node-title">碰撞时间：</div>-->
            <!--<div class="node-content">-->
            <!--<i class="icon iconfont icon-weibiaoti&#45;&#45;23 date-icon"></i>-->
            <!--<input type="text" class="date-input">-->
            <!--至-->
            <!--<i class="icon iconfont icon-weibiaoti&#45;&#45;23 date-icon"></i>-->
            <!--<input type="text" class="date-input">-->
            <!--</div>-->
            <!--<div class="node-title">碰撞设备：</div>-->
            <!--<div class="node-content">-->
            <!--<template>-->
            <!--<el-radio  label="1">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--<el-radio  label="2">设备1.1</el-radio>-->
            <!--</template>-->
            <!--</div>-->
            <!--</div>-->
            <!--</div>-->
            <!--</el-card>-->
            <!--</div>-->
            <!--</div>-->
            <div class="result-list task-list track-details personnel-matching">
                <div>
                    <h4>匹配轨迹</h4>
                    <button><i class="icon iconfont icon-weibiaoti--27"></i></button>
                </div>
                <div  class="step">
                    <el-steps direction="vertical" >
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                        <el-step title="坪和新寨" description="2017-10-02 08:30"></el-step>
                    </el-steps>
                </div>
            </div>

            <!--滑块-->
            <div class="crash-slug"></div>
        </div>
    </div>


</div>
<!-- 引入组件库 -->
<script type="text/javascript" src="../scripts/vue/vue.js"></script>
<script src="../scripts/jquery-3.0.0.min.js.js"></script>
<script type="text/javascript" src="../scripts/element/element.js"></script>
<script type="text/javascript" src="../scripts/swiper/swiper-4.1.6.min.js"></script>
<!--<script src="https://cdn.jsdelivr.net/npm/vue-awesome-swiper@3.1.2/dist/vue-awesome-swiper.js"></script>-->
<script type="text/javascript" src="../scripts/urls.js"></script>
<script src="../scripts/axios.min.js"></script>
<script type="text/javascript" src="../scripts/utils.js"></script>
<script src="../assets/map/offlinemap/map_load.js"></script>
<script src="../assets/map/layer/layer.js"></script>
<script src="../scripts/test.js"></script>
<script type="text/javascript">
    var vm=new Vue({
        el:'#app',
        data: {
            value6: '',
            value:'',
            value1:'',
            value4: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
            value5: '',
            radio_mac: 0,
            radio_imsi: 0,
            radio_idCoed: 0,
            checkList_mac: ['0'],
            checkList_imsi: ['0'],
            checkList_card: ['0'],
            options:[{
                value: '选项1',
                label: '黄金糕'
            }, {
                value: '选项2',
                label: '双皮奶'
            }, {
                value: '选项3',
                label: '蚵仔煎'
            }, {
                value: '选项4',
                label: '龙须面'
            }, {
                value: '选项5',
                label: '北京烤鸭'
            }]
        },
        mounted:function(){
            this.data();
        },
        methods:{
            data:function(){
                let pickerOptions2={
                    shortcuts: [{
                        text: '最近一周',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近一个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近三个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                            picker.$emit('pick', [start, end]);
                        }
                    }]
                }
            }
        }
    });
    // 百度地图API功能
    var map = new BMap.Map("map_demo");    // 创建Map实例
    map.centerAndZoom(new BMap.Point(116.404, 39.915), 7);  // 初始化地图,设置中心点坐标和地图级别
    map.setCurrentCity("武汉");          // 设置地图中心显示的城市 new！
    map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
    map.addControl(new BMap.NavigationControl());   //缩放按钮
    map.addControl(new BMap.MapTypeControl( {mapTypes: [BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]} ));   //添加地图类型控件 离线只支持普通、卫星地图; 三维不支持
    //监听地图缩放
    map.addEventListener("zoomend", function(){
        if( this.getZoom() > 8 ) {
            layer.msg("默认只有8级地图, 超过无法显示");
        }
    });

    var cr = new BMap.CopyrightControl({anchor: BMAP_ANCHOR_TOP_LEFT});   //设置版权控件位置
    map.addControl(cr); //添加版权控件
    var bs = map.getBounds();   //返回地图可视区域
    // cr.addCopyright({id: 1, content: "<a href='http://www.xiaoguo123.com/p/baidumap_offline_v21?baidumap' style='font-size:20px;background:yellow;margin-left:60px'>离线地图API V2.1, 默认8级地图, 点击获取更多信息</a>", bounds: bs});

</script>
</body>

</html>